<template>
  <div class="c-pb32">
    <div class="my-rank c-fs32">
      您当前排名第<span>{{curRank}}</span>名
    </div>
    <div v-for="(item,index) in rankList" v-bind:key="index" class="c-flex-row  c-aligni-center c-hh100 c-ph24">
      <div class="img-rank-medal c-mr28" v-if="index == 0">
        <img :src="require('../../../assets/i/wap/points/first.png')" alt="" />
      </div>
      <div class="img-rank-medal c-mr28" v-else-if="index == 1">
        <img :src="require('../../../assets/i/wap/points/second.png')" alt="" />
      </div>
      <div class="img-rank-medal c-mr28" v-else-if="index == 2">
        <img :src="require('../../../assets/i/wap/points/third.png')" alt="" />
      </div>
      <div class="c-mr28 c-fs24 c-fc-gray c-ww42 c-textAlign-c" v-else>
        {{index+1}}
      </div>
      <div class="c-flex-row c-aligni-center c-flex-grow1 c-bd-b1 c-h">
        <div class="c-flex-grow1 c-fs24 c-fc-sxblack c-ww260 c-text-ellipsis1">{{item.nickname}}</div>
        <div class="c-fs28 "><span class="c-fc-xxlred">{{item.points}}</span>&nbsp;&nbsp;{{companyAuth.integrateName1}}</div>
      </div>
    </div>

  </div>
</template>

<script>
import { utilJs } from "@/utils/common.js"
export default {
  name: "IntegralRank",
  components: {
  },
  props: [],
  data() {
    return {
      companyAuth: JSON.parse(localStorage.getItem("companyAuth")),
      curIntegral: 223,
      curRank: null, //当前排名
      rankList: [],
    };
  },
  created() {
    utilJs.appShare(this);
  },
  methods: {
    getRankInfo() {
      //获取排行榜信息
      var $this = this
      utilJs.getMethod(global.apiurl + 'members/pointRank', function (res) {
        $this.rankList = res.list
        $this.curRank = res.rank
      });
    },
    //分享
    wechatShare: function () {
      utilJs.wechatConfig("", "", "", "", function () { });
    },
    //手机端分享
    appShare: function () {
      utilJs.appShareTrue("", "", "", "");
    }
  },
  activated() {
    setDocumentTitle(this.companyAuth.integrateName1 + "排行");// eslint-disable-line
    this.getRankInfo();
    this.wechatShare();
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.my-rank {
  background-image: url("https://kposshzcdn.ckjr001.com/admin/material/9_material_admin/image/assets/i/wap/points/poin-bg.png");
  width: 100%;
  height: 5.85rem;
  background-size: 100% 5.85rem;
  background-repeat: no-repeat;
  color: #fff;
  /* line-height: 5.85rem; */
  /* text-align: center; */
  padding:3.65rem 0 0  1.25rem;;
}
.img-rank-medal {
  width: 1.05rem;
  height: 1.05rem;
}

.img-rank-medal img{
  width: 100%;
}
</style>
